var echarts;
var zul;
$(document).ready(function () {
    require.config({
        baseUrl: ctx + '/resource/plugins/echarts4',
        paths: {
            echarts: 'echarts',
            roma: 'theme/roma',
        }
    });
    require(
        [
            'echarts',
            'roma'
        ],
        function (ec) {
            ECharts = ec;
            queryLoadInfo();//负载均衡基本信息

            queryCpuYbp();//可连接状态

            qyeryJkdYbp();//负载均衡健康度

            fzjh_cpu_top = ECharts.init(document.getElementById('fzjh_cpu_top'), 'roma');//CPU使用率
            queryCpuTop();

            fzjh_nc_top = ECharts.init(document.getElementById('fzjh_nc_top'), 'roma');//内存使用率
            queryNcTop();
        }
    );
});

/**负载均衡基本信息*/
function queryLoadInfo() {
    $.ajax({
        url: ctx + "/HostPage/queryTableInfo",
        type: "post",
        data: {CI_TYPE: CI_TYPE},
        success: function (data) {
            var map = JSON.parse(data);
            var list = map.list;
            var list1 = map.list1;
            var tablel = "";
            zul = list1[0].ZSL;
            tablel += "<ul>" +
                "<li class='first' style='width:33.3%'>" + "分类" + "</li>" +
                " <li style='width:33.3%'>" + "资源总数" + "</li>" +
                "<li class='last' style='width:33.3%'>" + list[0].BIZ_TYPE + "</li>" +
                "</ul>" +
                "<ul>" +
                "<li class='first' style='width:33.3%'>" + "数量" + "</li>" +
                " <li style='width:33.3%'>" + list1[0].ZSL + "台" + "</li>" +
                "<li class='last' style='width:33.3%'>" + list[0].SL + "台" + "</li>" +
                "</ul>";
            $("#load_info").append(tablel);
        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });
}

/**可连接状态*/
function queryCpuYbp() {
    $.ajax({
        url: ctx + "/HostPage/queryYbp",
        type: "post",
        data: {KPI_CODE: "FM-00-02-003-01"},
        success: function (data) {
            var cpuState = JSON.parse(data);
            var qq = "<div class='easy-pie-chart percentage' data-percent='' id='load' data-color='#5eadf0'style='height: 75px; width: 75px; line-height: 74px; color: rgb(135, 184, 127);'>" +
                "<span class='percent' style='top:0px;left:40px;'>" + parseInt(cpuState[0].SUCCESS_VALUE / cpuState[0].COUNT_VALUE * 100) + "%" + "</span>" +
                "<canvas height='75' width='75'>" + "</canvas>" + "</div>" + "<h3 style='line-height:3;'>" + "可用性" + "</h3>";
            $("#load_kljzt_ybp").append(qq);
            $('#load').attr('data-percent', parseInt(cpuState[0].SUCCESS_VALUE / cpuState[0].COUNT_VALUE * 100));

            $('.easy-pie-chart.percentage').each(function () {
                $(this).easyPieChart({
                    barColor: $(this).data('color'),
                    trackColor: '#EEEEEE',
                    scaleColor: false,
                    lineCap: 'butt',
                    lineWidth: 8,
                    animate: ace.vars['old_ie'] ? false : 1000,
                    size: 120
                }).css('color', $(this).data('color'));
            });
        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });

}

//负载均衡健康度
function qyeryJkdYbp() {
    $.ajax({
        url: ctx + "/HostPage/queryJkd",
        type: "post",
        data: {CI_TYPE: CI_TYPE},
        success: function (data) {
            var cpuState = JSON.parse(data);
            var qq = "<div class='easy-pie-chart percentage' data-percent='' id='loadjkd' data-color='#87B87F'style='height: 75px; width: 75px; line-height: 74px; color: rgb(135, 184, 127);'>" +
                "<span class='percent' style='top:0px;left:40px;'>" + parseInt((zul - cpuState[0].EXT_UNIT_ID) / zul * 100) + "%" + "</span>" +
                "<canvas height='75' width='75'>" + "</canvas>" + "</div>" + "<h3 style='line-height:3;'>" + "健康度" + "</h3>";
            $("#load_jkd").append(qq);
            $('#loadjkd').attr('data-percent', parseInt((zul - cpuState[0].EXT_UNIT_ID) / zul * 100));

            $('.easy-pie-chart.percentage').each(function () {
                $(this).easyPieChart({
                    barColor: $(this).data('color'),
                    trackColor: '#EEEEEE',
                    scaleColor: false,
                    lineCap: 'butt',
                    lineWidth: 8,
                    animate: ace.vars['old_ie'] ? false : 1000,
                    size: 120
                }).css('color', $(this).data('color'));
            });
        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });

}

//CPU使用率top榜
//PM-00-01-001-05
function queryCpuTop() {
    $.ajax({
        url: ctx + "/HostPage/queryTop",
        type: "post",
        data: {KPI_CODE: "PM-00-01-001-05"},
        success: function (data) {
            var map = JSON.parse(data);
            var list = map.list;
            var xdata = [];
            var ydata = [];
            var x_value = [];
            for (var i = 0; i < list.length; i++) {
                x_value = list[i].IP_ADDR;
                xdata.push(x_value);
                ydata.push(list[i].AVG_VALUE);
            }
            option = {
                color: ['#3398DB'],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                legend: {
                    formatter: function (series) {
                        return series;
                    },
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        // data: [1, 12, 23, 3,],
                        data: xdata,
                        axisTick: {
                            alignWithLabel: true
                        },
                        axisLabel: {
                            interval: 0,
                            rotate: 45,
                            margin: 8
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        // max: 100,
                        splitLine: {
                            show: true,
                        },
                        nameTextStyle: {
                            color: '#000000',
                        },
                        axisLabel: {
                            formatter: '{value} ',
                            textStyle: {
                                color: '#000000'
                            }
                        }
                    },
                ],
                series: [
                    {
                        name: 'CPU使用率',
                        type: 'bar',
                        barWidth: '60%',
                        // color: '#3398DB',
                        itemStyle: {
                            normal: {
                                color: new ECharts.graphic.LinearGradient(
                                    0, 0, 0, 1,
                                    [
                                        {offset: 0, color: '#acc7f6'},
                                        {offset: 0.5, color: '#5eadf0'},
                                        {offset: 1, color: '#3621f0'}
                                    ]
                                )
                            },
                        },
                        data: ydata,
                    }
                ]
            };
            fzjh_cpu_top.setOption(option);
        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });
}

//内存使用率top榜
function queryNcTop() {
    $.ajax({
        url: ctx + "/HostPage/queryTop",
        type: "post",
        data: {KPI_CODE: "PM-00-01-002-01"},
        success: function (data) {
            var map = JSON.parse(data);
            var list = map.list;
            var xdata = [];
            var ydata = [];
            var x_value = [];
            for (var i = 0; i < list.length; i++) {
                x_value = list[i].IP_ADDR;
                xdata.push(x_value);
                ydata.push(list[i].AVG_VALUE);
            }
            option = {
                color: ['#3398DB'],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                legend: {
                    formatter: function (series) {
                        return series;
                    },
                    textStyle: {
                        color: '#AAAAAA'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        // data: [1, 12, 23, 3,],
                        data: xdata,
                        axisTick: {
                            alignWithLabel: true
                        },
                        axisLabel: {
                            interval: 0,
                            rotate: 45,
                            margin: 8
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        // max: 100,
                        splitLine: {
                            show: true,
                        },
                        nameTextStyle: {
                            color: '#000000',
                        },
                        axisLabel: {
                            formatter: '{value} ',
                            textStyle: {
                                color: '#000000'
                            }
                        }
                    },
                ],
                series: [
                    {
                        name: '内存使用率',
                        type: 'bar',
                        barWidth: '60%',
                        // color: '#3398DB',
                        itemStyle: {
                            normal: {
                                color: new ECharts.graphic.LinearGradient(
                                    0, 0, 0, 1,
                                    [
                                        {offset: 0, color: '#acc7f6'},
                                        {offset: 0.5, color: '#5eadf0'},
                                        {offset: 1, color: '#3621f0'}
                                    ]
                                )
                            },
                        },
                        data: ydata,
                    }
                ]
            };
            fzjh_nc_top.setOption(option);
        }, error: function (textStatus) {
            console.log("error:" + textStatus.status);
        }
    });
}